<template>
	<view style="padding-bottom: 150rpx;">	
		<!-- 创建谱文 -->
		<view class="pu_category" @tap="toCategory">
			<view class="category_title">谱文类目</view>
			<view class="flex ali-c">
				<view v-if="pitch_title" class="category_title_text">{{pitch_title}}</view>
				<image class="cate_more"  :src="photo_cdn + 'zpupload/static/tablet/more.png'"></image>
			</view>
			
		</view>
		<view class="wen_category">
			<view class="pu_title">标题</view>
			<input class="edit_input_tag" v-model="enter_title" type="text" value="" placeholder="请输入标题" ></input>
		</view>
		
		<xiaEditor ref="xiaeditor" :value="content" placeholder="" @editorChange="getHtml"></xiaEditor>
		
		<view @tap="submitfun" class="conserve">
			<view class="save_btn">保存</view>
		</view>
	</view>
</template>

<script>
	import xiaEditor from '@/components/xia-editor/xia-editor.vue';
	import {submitArticle,puwen_detail,edit_article} from "@/utils/api/zupu.js";
	import config from "@/utils/config.js";
	let {staticurl,photo_cdn} = config.baseUrl;
	export default{
		components: {
			xiaEditor
		},
		data(){
			return{
				photo_cdn,
				family_id:'',
				enter_title:'',//输入的标题
				pitch_title:'',//选中的类目
				column_id:0,//类目id
				content:"",
				source:0,//1表示从指定类目进来，不能更改类目
			}
		},
		onLoad(option){
			this.family_id = option.family_id?option.family_id:'';
			this.pitch_title = option.pitch_title?option.pitch_title:'';
			this.column_id = option.column_id?option.column_id:0;
			this.article_id = option.article_id?option.article_id:0;
			this.source = option.source?option.source:0;
			if(this.source==2){
				this.puwen_detailfun();
			}
		},
		methods:{
			//得到的富文本 change
			getHtml(e){
				console.info(e);
				this.content = e;
			},
			//去谱文类目
			toCategory(){
				if(this.source==1){
					return false;
				}
				uni.navigateTo({
					url: `/pages/zupu/puwen/wen_category/wen_category?family_id=${this.family_id}`
				})
			},
			//获取谱文详情
			puwen_detailfun(){
				puwen_detail({
					article_id:this.article_id
				}).then(res=>{
					if(res.code==1){
						this.enter_title = res.data.info.title;
						this.content = res.data.info.content;
						this.column_id = res.data.info.column_id;
						if(this.content){
							this.$nextTick(()=>{
								this.$refs.xiaeditor.onEditorReady();
							})
						}
						
					}
				})
			},
			//保存提交
			submitfun(){
				if(!this.pitch_title){
					this.$api.msg("请选择类目!");
					return false;
				}
				if(!this.enter_title){
					this.$api.msg("请输入标题!");
					return false;
				}
				if(!this.content){
					this.$api.msg("请输入内容!");
					return false;
				}
				if(this.source==2){
					console.log('走了22222')
					console.log(this.pitch_title,this.content)
					edit_article({
						article_id:this.article_id,
						title:this.enter_title,
						content:this.content
					}).then(res=>{
						if(res.code==1){
							this.$api.msg(res.msg);
							setTimeout(()=>{
								uni.navigateBack();
							},1000)
						}
					})
				}else{
					console.log('走了1111')
					submitArticle({
						title:this.enter_title,
						column_id:this.column_id,
						content:this.content,
						family_id:this.family_id
					}).then(res=>{
						if(res.code==1){
							this.$api.msg("提交成功!");
							uni.navigateTo({
								url:`/pages/zupu/familytrees/familytrees?family_id=${this.family_id}&tab_pu=2`
							})
						}else{
							this.$api.msg(res.msg);
						}
					})
				}
			}
		}
	}
</script>

<style lang="scss">
	@import "./create_puwen.scss"
</style>